import Vue from 'vue'
// 引入 vuex
import Vuex from 'vuex'
// 应用Vuex插件
Vue.use(Vuex)

// 创建并暴露 store
export default new Vuex.Store({
  // 用于存储数据
  state: {
    sum: 0,
    personList: [
      {id: '001', name: '张三'}
    ]
  },
  // 用于操作数据(state)
  mutations: {
    ADD(state, value) {
      state.sum += value
    },
    SUBTRACT(state, value) {
      state.sum -= value
    },
    ADD_PERSON(state, value) {
      state.personList.push(value)
    }
  },
  // 用于响应组件中的动作, 业务逻辑都在这, 不要放在mutations中
  actions: {
    // context 就是一个mini版的store, value为组件中传递的数值
    // add 和 subtract 没有逻辑就是简单的直接调用mutations中的操作数据的方法,
    // 所以在组件中可以直接和mutations通信不用再dispatch调用到action中了
    /*add(context, value) {
      context.commit('ADD', value)
    },
    subtract(context, value) {
      context.commit('SUBTRACT', value)
    },*/
    addOdd(context, value) {
      if (context.state.sum % 2) {
        context.commit('ADD', value)
      }
    },
    addWait(context, value) {
      setTimeout(() => {
        context.commit('ADD', value)
      }, 2000)
    }
  },
  getters: {
    bigSum(state) {
      return state.sum * 10
    }
  },
  modules: {
  }
})
